<template>
	<view class="wrap">
		<u-row gutter="16">

			<u-col span="4">
				<view class="demo-layout">单价</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">￥1500.00</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">数量</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">3500 (USDT)</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">订单号码</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">0520641852041</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">下单时间</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">2020-02-02 12:30</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">订单金额</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">￥2500.00</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">订单限额</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">￥10.00 ~ ￥100</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">收款人</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">刘德华</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">账户类型</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">中国银行</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">收款账户</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">52634152655245156235</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">联系方式</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">13835661569</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">商家昵称</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout2">宇都宫紫苑</view>
			</u-col>

			<u-line color="#5559691f"></u-line>
			<u-col span="4">
				<view class="demo-layout">支付方式</view>
			</u-col>
			<u-row gutter="16" justify="start">

				<!-- 支付宝 -->
				<u-col span="2">
					<view class="">
						<image class="funsItemImage" src="../../static/business/zfb.png"></image>
					</view>
				</u-col>
				<!-- 微信 -->
				<u-col span="2">
					<view class="">
						<image class="funsItemImage" src="../../static/business/wx.png"></image>
					</view>
				</u-col>
				<!-- 银行卡 -->
				<u-col span="2">
					<view class="">
						<image class="funsItemImage" src="../../static/business/yhk.png"></image>
					</view>
				</u-col>

				<!-- 交易反馈 -->
				<view class="gman">
					<u-button size="mini" plain>正在交易</u-button>
				</view>
			</u-row>

			<view class="flex alcenter mt10 plr20">
				<image src="../../static/image/tssp.png" class="wt15 h15"></image>
				<view class="chengse ft14 plr20">商家超时未放币，或联系不上商家请撤销订单</view>
			</view>

		</u-row>

		<u-button type="primary">撤 单</u-button>

	</view>
</template>
<script>
	import {
		domain
	} from '@/common/domain.js'
	import {
		mapState,
		mapActions,
		mapGetters
	} from 'vuex';
	import {
		depositPage,
		deposit
	} from '../../common/apiString.js'
	import {
		myMixins
	} from '@/common/myMixins.js' //加入全局下拉刷新
	export default {
		mixins: [myMixins],
		components: {},
		data() {
			return {


			}
		},
		onShow() {

		},
		computed: {
			...mapState({
				theme: state => state.theme
			}),
		},
		onLoad: function(option) { //option为object类型，会序列化上个页面传递的参数 

			console.log(option.orderNo); //打印出上个页面传递的参数。

			console.log(option.name); //打印出上个页面传递的参数。

		},

		methods: {
			//路由开始
			funsItemClick(index) {
				if (index == 1) {
					uni.navigateTo({
						url: '/pages/business/bzj' //公告
					})
				};
				if (index == 2) {
					uni.switchTab({
										url:'/pages/assets/assets'
									})
				};

			},
			getdepositPage() {
				this.$utils.initDataToken({
					url: depositPage,
					type: 'post'
				}, (res, msg) => {
					this.deposit = res.USDT
					this.usedPrice = res.usedPrice
				})
			},

			//路由结束
		},
	}
</script>
<style scoped lang="scss">
	page {
		background: #f8f8f99c;
	}

	.wrap {
		padding: 24rpx;

		.funsItemImage {
			position: relative;
			top: 0vw;
			width: 6vw;
			height: 6vw;
			border-radius: 0%;
		}

		.gman {
			position: relative;
			top: 0vw;
			right: 0;
			left: 22vw;
		}
	}

	.u-row {
		margin: 20px 0px;
		/* border: 0.5px solid #f4f4f5; */
		width: 100%;
		background-color: #fff;
		border-radius: 1vw;
		padding: 2px;
		margin-top: 10px;
		/* border: 0.5px solid #f4f4f5; */
	}

	.demo-layout {
		height: 40px;
		line-height: 40px;
		font-size: 3.4vw;
		font-weight: 700;
	}

	.bg-purple {
		background: #d3dce6;
	}

	.bg-purple-light {
		background: #e5e9f2;
	}

	.bg-purple-dark {
		background: #99a9bf;
	}
</style>
